<template>
	<view>
		<!--页面标题头begin-->
		<view class="smart-page-head">
			<view class="snart-page head-title">button按钮</view>
		</view>
		<view>
			<button type="prinary">页面主操作 nornal</button>
			<button class="btn" type="prinary" :loading="isLoading" @click="btnSave()">页面主操作 loading</button>
			<button type="default" disabled="false">页面次操作</button>
			<button type="warn">警告操作 warn</button>
			<button type="primary" plain="true">镘空按钮 plain</button>
			<button type="prinary" size="mini" class="minbutn">mini按鍶</button>
		</view>
	</view>

</template>

<script>
	export default {
		data() {
			return {
				isLoading:false

			}
		},
		methods: {
			btnSave(){
			this.isLoading = true;
			uni.showLoading({
			title:"数据加载中..."
			});
			setInterval(()=>{
			this.isLoading=false;
			uni.hideLoading();
			},5000)
			}

		}
	}
</script>

<style>
	/*表示当前页面所有button标签*/
	button {
		margin: 30upx;
	}btn {
		margin: 10upx;
	}

	.minbutn {
		background-color: #4CD964;
		color: #333333;
		width: 200upx;
	}
</style>